<template>
    <!-- 编辑弹窗 -->
	<el-dialog
	:title="hd"
	:visible.sync="$store.state.dialogadd"
	width="30%">
    <el-form label-width="120px" :model="data" :rules="rules" ref="form">
        <el-form-item :label="name[0]" prop="username">
            <el-input v-model="data.username" ></el-input>
        </el-form-item>
        <el-form-item :label="name[1]" prop="power">
            <el-input v-model="data.power" ></el-input>
        </el-form-item>
        <el-form-item :label="name[2]" prop="password">
            <el-input v-model="data.password" ></el-input>
        </el-form-item>
        <el-form-item :label="name[3]" prop="cal">
            <el-input v-model="data.cal" ></el-input>
        </el-form-item>
        <el-form-item :label="name[4]" prop="email">
            <el-input v-model="data.email"></el-input>
        </el-form-item>
        <el-form-item :label="name[5]" prop="sex">
            <el-radio v-model="data.sex" label="男">男</el-radio>
            <el-radio v-model="data.sex" label="女">女</el-radio>
        </el-form-item>

        <el-form-item class="btns">
            <button @click="$store.state.dialogadd = false">取 消</button>
            <button @click="subDialog">确 定</button>
        </el-form-item>
    </el-form>
	</el-dialog>
</template>
<style lang="scss">
    .el-dialog {
        .el-form{
            .el-input {
                width: 85%;
            }
            .btns {
                text-align: right;
                margin-right: 60px;
                button {
                    padding: 5px 10px;
                    margin: 0 5px;
                }
            }
        }
    }
</style>
<script>
export default {
    props: [  'url', 'name', 'hd',  ],
    data() {
        return {
            data: {},
            rules: {
                username:[{required: true, trigger: 'blur' ,  message: '请输入内容'}],
                power:[{required: true, trigger: 'blur' ,  message: '请输入内容'}],
                password:[{required: true, trigger: 'blur' ,  message: '请输入内容'}],
                cal:[{required: true, trigger: 'blur' ,  message: '请输入内容'}],
                email:[{required: true, trigger: 'blur' ,  message: '请输入内容'}],
            }
        }
    },
    created() {
        // console.log(this);
    },
    methods: {
        subDialog() {
            this.$store.state.dialogadd = false
            this.$refs.form.validate(valid => {
                if(valid) {
                    this.$http.post(this.url, {data: this.data})
                        .then(({ data }) => {
                            if(!data.errno) {
                                this.$message({
                                message: data.msg,
                                type: 'success'
                            })
                            setTimeout(() => {
                                this.$router.go(0)
                            },1000)
                            }
                        })
                }
            })
        }
    }
}
</script>